<!DOCTYPE html>
<html>
<body onload="checkv()">

<h1>我的 Web 页面</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">尝试一下</button>
<p id="demo1">若5</p>


<input id="fname" type="text" placeholder="请输入" onchange="updateText()">

<!-- 可以指定相对或绝对路径 -->
<img id="image1" src="E:/syjh/doc/aicc.jpg">

<div id="mmv">
<p>    啊啊啊111</p>
<p>    啊啊啊222</p>
</div>

<h1 id="llo">LLo09</h1>
<h1 id="llo2">llo00923dfsl</h1>

<h1 id="h1" onclick="this.innerHTML='haha h1'">点击h1</h1>
<p class="intro">你好世界</p>

<button type = "button" onclick="updateLlo2()">改变llo2</button><br>
<button id="btn1" type = "button">改变llo2-2222</button><br>
<button id="btn2" type = "button" 
    onmouseover="btn2mo(this)" 
    onmouseout="btn2mout(this)"
    onmousedown="btn2md(this)"
    onmouseup="btn2ms(this)"
    onclick="btn2click(this)"
>
    改变llo2-3333
</button>

<script>
document.write("<br>")

//通过获取节点 分配事件
document.getElementById("btn1").onclick = updateLlo2


//通过id获取节点
x=document.getElementById("demo1")
document.write("该内容为js编写 demo1:" + "<b>" + x.innerHTML + "</b>")
document.write("<br>")

var mv = document.getElementById("mmv")
//获取多节点集
var mv_e = mv.getElementsByTagName("p")
document.write("mmv元素:" + "<b>" + mv_e[1].innerHTML + "</b>")

//通过class获取节点
document.write("<br>")
intro = document.getElementsByClassName("intro")
document.write("intro 内容:" + "<b>" + intro[0].innerHTML + "</b>")

var llo = document.getElementById("llo")
//改变内容
llo.innerHTML = "LLu879"    

//改变格式
llo.style.color = "blue"
llo.style.fontFamily = "Arial"
llo.style.fontSize = "larger"

function checkv() {
    //alert("v ok")
}

function updateText() {
    var e = document.getElementById("fname")
    e.value += "0"
}

function btn2mo(o) {
    o.innerHTML = '321'
}
function btn2mout(o) {
    o.innerHTML = '456'
}

function btn2md(o) {
    o.innerHTML = 'btn md'
}
function btn2ms(o) {
    o.innerHTML = 'btn ms'
}

function btn2click(o) {
    //o.innerHTML = 'btn click'
}

function updateLlo2() {
    var llo2 = document.getElementById("llo2")
    llo2.style.color = "red"
}

</script>
</body>
</html>

